<%@ page contentType="text/html; charset=UTF-8" pageEncoding="UTF-8" %>
<%@ taglib uri="/WEB-INF/tlds/c.tld" prefix="c"%>
<%@ taglib uri="/WEB-INF/tlds/fmt.tld" prefix="fmt"%>
<%@ taglib uri="/WEB-INF/tlds/tiles-jsp.tld" prefix="tiles"%>

<jsp:include page="js/crear_solicitud_js.jsp"></jsp:include>

<form id="crearSolicitudForm">
<fieldset class="fieldset">
	<legend class="legend">SOLICITUD DE PERSONAL</legend>
	<table class="formTable" style="width: 800px">
		<tr>
			<td class="label" width="220px;">Fecha Esperada de Incorporacion:</td>
			<td>
				<input type="text" class="formField" style="width:65px;" name="fechaEsperadaIncorporacion" id="fechaEsperadaIncorporacion">
				<img src="${pageContext.request.contextPath}/resources/images/calendar.png" 
					onclick="event.preventDefault();$('#fechaEsperadaIncorporacion').datepicker('show');" style="vertical-align:middle;"/>
			</td>
		</tr>
		<tr><td colspan="2"></td></tr>
		<tr>
			<td class="label">Gerente solicitante:</td>
			<td><input type="text" class="formField" style="width:400px;" name="gerenteSolicitante" id="gerenteSolicitante"></td>
		</tr>
		<tr><td colspan="2"></td></tr>
		<tr>
			<td class="label">Perfil Requerido:</td>
			<td>
				<select id="perfilRequeridoCode" class="formField" style="height:23px;width:170px;" name="perfilId">
					<option value="">Seleccione un perfil</option>
					<c:forEach var="perfil" items="${perfiles}">
						<option value="${perfil.id}">${perfil.nombre}</option>
					</c:forEach>
				</select>
			</td>
		</tr>
		<tr><td colspan="2"></td></tr>
		<tr>
			<td class="label">Cantidad de Vacantes:</td>
			<td><input type="text" class="formField" style="width:25px;" maxlength="3" name="cantidadVacantes" id="cantidadVacantes"></td>
		</tr>
		<tr><td colspan="2"></td></tr>
		<tr>
			<td class="label">Oficina:</td>
			<td>
				<select id="oficinaCode" class="formField" style="height:23px;width:170px;" name="oficinaCode">
					<option value="">Seleccione una oficina</option>
					<c:forEach var="oficina" items="${oficinas}">
						<option value="${oficina.codigo}">${oficina.descripcion}</option>
					</c:forEach>
				</select>
			</td>
		</tr>
		<tr><td colspan="2"></td></tr>
		<tr>
			<td class="label">Superior Directo:</td>
			<td><input type="text" class="formField" style="width:400px;" name="superiorDirecto" id="superiorDirecto"></td>
		</tr>
		<tr><td colspan="2"></td></tr>
	</table>
	
	<div class="separador">&nbsp;</div>
	
	<table class="formTable" style="width: 800px">
		<tr>
		    <td rowspan="4" class="label" width="220px;">Necesidad del Ingreso:</td>
		    <td align="left"><input type="radio" name="necesidadIngresoCode" value="RE" id="necesidadIngresoCodeRE"/>&nbsp;<label>Reemplazo</label></td>
		 </tr>
		 <tr>
		    <td align="left"><input type="radio" name="necesidadIngresoCode" value="NP" id="necesidadIngresoCodeNP"/>&nbsp;<label>Necesidad de Proyecto</label></td>
		 </tr>
		 <tr>
		    <td align="left"><input type="radio" name="necesidadIngresoCode" value="NO" id="necesidadIngresoCodeNO"/>&nbsp;<label>Necesidad organizacional</label></td>
		 </tr>
		 <tr>
		    <td align="left"><input type="radio" name="necesidadIngresoCode" value="OT" id="necesidadIngresoCodeOT"/>&nbsp;<label>Otros:</label></td>
		 </tr>
		 <tr>
		    <td>&nbsp;</td>
		    <td>
		    	<textarea name="otraNecesidadIngreso" id="otraNecesidadIngreso" class="formField" 
		    		style="min-height: 60px; max-height: 60px; min-width: 400px; max-width: 400px; display: none"></textarea>
		    </td>
		 </tr>	
	</table>
	
	<div class="separador">&nbsp;</div>
	
	<table class="formTable" style="width: 800px">
		<tr>
			<td class="label" width="220px;">Proyecto Asignado:</td>
			<td><input type="text" class="formField" style="width:400px;" name="proyectoAsignado" id="proyectoAsignado"></td>
		</tr>
		<tr><td colspan="2"></td></tr>
		<tr>
			<td class="label">Observaciones:</td>
			<td><textarea class="formField" style="min-height: 60px; max-height: 60px; min-width: 400px; max-width: 400px;" name="observaciones" id="observaciones"></textarea></td>
		</tr>
		<tr><td colspan="2"></td></tr>
	</table>	
</fieldset>
</form>
<!-- Botonera -->
<table style="float:right;position:relative;width:200px;margin-right: 30px;">
	<tr>
		<td class="formActions" style="float:right">
			<input type="button" value="Guardar" id="guardar" class="button">
		</td>
	</tr>
</table>
<br/>